<!--
 * @Author: 你的名字
 * @Date: 2022-10-13 10:08:55
 * @FilePath: /demo-gather/src/views/Pdf/Index.vue
 * @Description: 
-->
<template>
  <el-container>
    <el-header>
      <el-card>
        <div>
          <el-button
            style="font-style: oblique; font-size: 18px"
            @click="handlePreviewFile"
            >PDF 预览</el-button
          >
          <el-button
            style="float: right; line-height: 40px; padding: 3px"
            type="text"
            @click="handleSafetyExperience"
            ><i class="el-icon-caret-left">返回</i></el-button
          >
        </div>
      </el-card>
    </el-header>
    <el-main>
      <el-card class="card-style">
        <pdf-preview ref="pdfSearch" :src="src"></pdf-preview>
      </el-card>
    </el-main>
  </el-container>
</template>
   
   <script>
import PdfPreview from "@/components/common/PdfPreview.vue";
// import pdfSrc from "@/assets/pdf/1.pdf";
import pdf from "vue-pdf";
export default {
  name: "InfoExperience",
  components: {
    PdfPreview,
  },
  data() {
    return {
      src: 'static/1.pdf',
    //   src: "http://storage.xuetangx.com/public_assets/xuetangx/PDF/PlayerAPI_v1.0.6.pdf",
    };
  },
  created() {
    this.getUrl();
  },
  methods: {
    getUrl() {
      this.src = pdf.createLoadingTask(this.src);
      //   return import(
      //     "./buffer-loader!pdfjs-dist/cmaps/" +
      //       query.name +
      //       ".bcmap" /* webpackChunkName: "noprefetch-[request]" */
      //   ).then(function (bcmap) {
      //     //加载完语言文件后清除缓存
      //     delete require
      //       .cache[require.resolve("./buffer-loader!pdfjs-dist/cmaps/" + query.name + ".bcmap")];
      //     return {
      //       cMapData: bcmap.default,
      //       compressionType: CMapCompressionType.BINARY,
      //     };
      //   });
    },
    handlePreviewFile() {
      this.$refs.pdfSearch.handleOpen();
    },
    handleSafetyExperience() {
      this.$router.push({ path: "/safetyApp/sharedExperience" });
    },
  },
};
</script>
   
   <style>
  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }
  .clearfix:after {
    clear: both
  }

  .box-card {
    margin: 0 auto;
    width: 480px;
  }
  .el-form-item__content {
    margin-left: 0;
  }
  </style>